// Todo Component

<template>
  <div class="te-select">
    <div class="te-select-selected" @click="click">
      Title
    </div>

    <ul class="te-select-options" >
      <slot>

      </slot>
    </ul>
  </div>
</template>

<script>
export default {
  name: "teSelect",
  model: {
    prop: "value",
  },
  props: {
    value: {
      type: Array,
      required: true,
    },
  },
  data() {
    return {
      change: 0,
      show: false,
    };
  },
  methods: {
    click() {
      this.show = !this.show;
    },
  },

  watch: {
    change(val) {
      console.log(this.change, val);
    },
  },
};
</script>

<style scoped>
.te-select{
  color: #343434;
}
.te-select-selected {
  background: #fff;
  padding: 0 14px;
  height: 40px;
  line-height: 40px;
}

ul {
  position: absolute;
  list-style: none;
  padding: 0;
  margin: 0;
}

.te-select-options{
  
}
</style>
